<!DOCTYPE html>
<html>

<!--包含头部-->
{include file='head'}


<section class="rt_wrap content mCustomScrollbar">
 <div class="rt_content">
  <div class="page_title">
   <h2 class="fl">编辑会员</h2>
  </div>

  <!--添加会员的信息-->
  <ul class="ulColumn2">

   {foreach $user as $u}
   <form action="{$webSite}admin/admin/upload" method="post" enctype="multipart/form-data" name="fm1">
    <li>
     <span class="item_name" style="width:120px;">上传头像：</span>
     <label class="uploadImg">
      <input type="hidden" name="hide" value="{$u['admin_id']}">
      <img src="{$webSite}{$u['admin_pic']}" style="width:100px;">
      <input type="file" id="pic" name="img"/>
      <!--<span>上传头像</span>-->
     </label>
     <input type="submit" class="link_btn" value="上传头像">
    </li>
   </form>

   <li>
    <span class="item_name" style="width:120px;">管理员名称：</span>
    <input type="text" class="textbox textbox_225"  placeholder="会员账号..." name="username" maxlength="20" value="{$u['admin_name']}" dbName="{$u['admin_name']}"/>
    <span class="tips"></span>
   </li>
   <li>
    <span class="item_name" style="width:120px;">登陆密码：</span>
    <input type="password" class="textbox textbox_225"  placeholder="会员密码..." name="password" maxlength="32" value="{$u['admin_password']}" dbPwd="{$u['admin_password']}"/>
    <span class="tips"></span>
   </li>
   <li>
    <span class="tips2"></span>
   </li>
   <li>
    <span class="item_name" style="width:120px;">电子邮箱：</span>
    <input type="email" class="textbox textbox_225"  placeholder="电子邮件地址..." name="email" maxlength="50" value="{$u['admin_email']}" dbEmail="{$u['admin_email']}"/>
    <span class="tips"></span>
   </li>
   <li>
    <span class="item_name" style="width:120px;">手机号码：</span>
    <input type="tel" class="textbox textbox_225" placeholder="手机号码..." name="phone" maxlength="12"  value="{$u['admin_phone']}" dbPhone="{$u['admin_phone']}"/>
    <span class="tips"></span>
   </li>
   <li>
    <span class="item_name" style="width:120px;">居住地址：</span>
    <select class="select" id="sel1" dbPro="$address[0]" site="{$webSite}">
     <!--省级地区-->
     <option value="-1">选择省份</option>
     {foreach $area as $areaOne}
     {if $areaOne['pid'] == 0}
     <option value="{$areaOne['area_id']}">{$areaOne['area_name']}</option>
     {/if}
     {/foreach}

    </select>
    <select class="select" id="sel2" dbCity="$address[1]">
     <!--市级-->
     <option value="-1">选择城市</option>

    </select>
    <select class="select" id="sel3" dbCoun="$address[2]">
     <!--县级地区-->
     <option value="-1">选择区/县</option>

    </select>
    <span class="tips"></span>

   </li>
   <li>
    <span class="item_name" style="width:120px;">详细地址：</span>
    <input type="text" class="textbox textbox_295" placeholder="详细地址..." name="place" maxlength="30" value="{$u['detail_address']}" dbPlace="{$u['detail_address']}"/> <span class="tips"></span><!--value="陕西省西安市未央区凤城五路旺景国际大厦"-->
    <span></span>
   </li>
   {/foreach}

   <li>
    <span class="item_name" style="width:120px;"></span>
    <input type="button" class="link_btn" value="修改" name="btn"/>
   </li>

  </ul>
 </div>
</section>
</body>
</html>
<script>

    //提交数据
    $(function () {

        //标记位
        var fName  = true;
        var fPwd   = true;
        var fLev   = true;
        var fEmail = true;
        var fPhone = true;
        var fPlace = true;

        //变量
        var $oPic   = null; //头像
        var $oName = null; //用户名的值
        var $oPwd  = null; //密码的值
        var $oLev  = null; //用户等级
        var $oPhone = null; //号码
        var $oEmail = null; //邮箱
        var $oPlace = null; //邮箱

        //三级联动变量
        var $oFid = null;   //省级
        var $oSid = null;   //市级
        var $oCid = null;   //县区
        var $addr = null;   //_省_市_县_

        var all = []; //存放变化的数据

        //获取原数据
        var oldName = $('[name=username]').attr('dbName');
        var oldPwd = $('[name=password]').attr('dbPwd');
        var oldLev = $('#sel0').attr('dbLev');
        var oldEmail = $('[name=email]').attr('dbEmail');
        var oldPhone = $('[name=phone]').attr('dbPhone');
        var oldSel1 = $('#sel1').attr('dbPro');
        var oldSite = $('#sel1').attr('site');
        var oldSel2 = $('#sel2').attr('dbCity');
        var oldSel3 = $('#sel3').attr('dbCoun');
        var oldPlace = $('[name=place]').attr('dbPlace');
        //fPlace = true;
        //获取地址汉字
        var $oFval = null;
        var $oSval = null;
        var $oCval = null;
        var $allPlace = null;

       // 用户名,失去焦点事件
       $('[name=username]').blur(function () {

                //清空
                delete all['admin_name'];

                //获取用户名的值, 动用正则,排除输入空字符符号
                $oName = $('[name=username]').val().replace(/(^\s*)|(\s*$)/g, "");

                //比对用户名
                if (oldName == $oName) {
                    $('.tips').eq(0).addClass('errorTips').html('用户名未修改').css('color','blue');
                    fName = true;
                } else {

                    //判断用户名是否为空
                    if ($oName.length ==0) {
                        $('.tips').eq(0).addClass('errorTips').html('用户名不得为空').css('color','red');
                        fName = false;
                        return false;
                    }

                    //判断用户名长度不超过12,汉字不超过4个, 注意js中的一个汉字占用1个字节,php中一个汉字占3个字节
                    //利用正则判断汉字
                    if($oName.match( /^[\u4E00-\u9FA5]{1,}$/)){
                        //alert('这是汉字');
                        if ($oName.length  > 4 || $oName.length < 1) {
                            $('.tips').eq(0).addClass('errorTips').html('用户名应为 1~4 个汉字').css('color','red');
                            fName = false;
                            return false;
                        }

                    } else {
                        //alert('这不是汉字');
                        if ($oName.length > 12 || $oName.length < 3) {
                            $('.tips').eq(0).addClass('errorTips').html('用户名应为 3~12 位字符串').css('color','red');
                            fName = false;
                            return false;
                        }
                    }
                    fName = true;
                    //console.log(fName);
                    //标记位为true才能向后台传输数据
                    if (fName)

                        all['admin_name'] = $oName;

                        //ajax传输
                        $.post(oldSite + 'admin/user/username',{username:$oName},success,'json');
                    }
            });


        //密码,失去焦点
        $('[name=password]').blur(function () {

                //console.log(fName);
                //使每一步逻辑关联
                if (!fName) {

                    $('.tips').eq(1).addClass('errorTips').html('请先完成上一步操作').css('color','red');
                    return false;
                }

                //清空
                delete all['admin_password'];

                //获取密码值
                $oPwd = $('[name=password]').val().replace(/(^\s*)|(\s*$)/g, "");

                //比对密码
                if (oldPwd == $oPwd) {
                    $('.tips').eq(1).addClass('errorTips').html('密码未修改').css('color','blue');
                    fPwd = true;
                } else {

                    //判断密码是否为空
                    if ($oPwd.length ==0) {
                        $('.tips').eq(1).addClass('errorTips').html('密码不得为空').css('color','red');
                        fPwd = false;
                        return false;
                    }

                    //判断密码长度
                    //利用正则判断汉字
                    if($oPwd.match( /^[\u4E00-\u9FA5]{1,}$/)){

                        //alert('这是汉字');
                        $('.tips').eq(1).addClass('errorTips').html('密码不得为汉字').css('color','red');
                        fPwd = false;
                        return false;

                    } else {
                        //alert('这不是汉字');
                        if ($oPwd.length > 12 || $oPwd.length < 3) {
                            $('.tips').eq(1).addClass('errorTips').html('密码应为 3~12 位非汉字符串').css('color','red');
                            fPwd = false;
                            return false;
                        }
                    }

                    //判断是否为纯数字
                    if (!isNaN($oPwd)) {
                        $('.tips').eq(1).addClass('errorTips').html('密码不能为纯数字').css('color','red');
                        fPwd = false;
                        return false;
                    }

                    fPwd = true;
                    all['admin_password'] = $oPwd;

                    $('.tips').eq(1).addClass('errorTips').html('密码合法').css('color','green');
                }


            });

        //获取用户等级
       /* $('#sel0').change(function() {
        //$('#sel0').click(function() {

            //关联
            if (!fPwd) {

                $('.tips2').eq(0).addClass('errorTips').html('请先完成上一步操作').css('color','red');
                fLev = false;
                return false;
            }
            //清空
            delete all['level_id'];

            fLev = true;
            $oLev = $('#sel0').val();

            if (!$oLev) {  //等级为空时,说明未修改
                $oLev = oldLev

            } else {
                //比对等级
                if (oldLev == $oLev || $oLev == 0) {
                    $('.tips2').eq(0).addClass('errorTips').html('等级未修改').css('color','blue');
                } else {

                    all['level_id'] = $oLev;

                    $('.tips2').eq(0).addClass('errorTips').html('合法').css('color','green');
                }
            }

        });*/


        //邮箱
        $('[name=email]').blur(function () {

                //关联
            　　//if (!fLev) {
            　　if (!fPwd) {

                    $('.tips').eq(2).addClass('errorTips').html('请先完成上一步操作').css('color','red');
                    return false;
                }

                //取值
                $oEmail = $('[name=email]').val().replace(/(^\s*)|(\s*$)/g, "");

                //清空
                delete all['admin_email'];

                //比对邮箱
                if (oldEmail == $oEmail) {

                    $('.tips').eq(2).addClass('errorTips').html('邮箱未修改').css('color','blue');
                    fEmail = true;
                } else {

                    //判断是否为空
                    if ($oEmail.length ==0) {
                        $('.tips').eq(2).addClass('errorTips').html('邮箱不得为空').css('color','red');
                        fEmail = false;
                        return false;
                    }

                    //判断邮箱格式
                    var myreg = /^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/;

                    if(!myreg.exec($oEmail))
                    {
                        /*  alert('提示\n\n请输入有效的E_mail！');
                          myreg.focus();*/
                        $('.tips').eq(2).addClass('errorTips').html('邮箱格式错误').css('color','red');
                        fEmail = false;
                        return false;
                    }

                    fEmail = true;
                    if (fEmail) {

                        all['admin_email'] = $oEmail;

                        //查询邮箱是否唯一
                        $.post(oldSite + 'admin/user/email',{email:$oEmail},success,'json');
                    }
                }
            });



        //手机号码,失去焦点
        $('[name=phone]').blur(function () {

                //关联
                if (!fEmail) {

                    $('.tips').eq(3).addClass('errorTips').html('请先完成上一步操作').css('color','red');
                    return false;
                }

                //取值
                $oPhone = $('[name=phone]').val().replace(/(^\s*)|(\s*$)/g, "");

                //清空
                delete all['admin_phone'];

                //比对手机号码
                if (oldPhone == $oPhone) {

                    $('.tips').eq(3).addClass('errorTips').html('手机号码未修改').css('color','blue');
                    fPhone = true;

                } else {

                    //判断是否为空
                    if ($oPhone.length ==0) {
                        $('.tips').eq(3).addClass('errorTips').html('手机号码不得为空').css('color','red');
                        fPhone = false;
                        return false;
                    }

                    //判断号码格式
                    if(!(/^1[34578]\d{9}$/.test($oPhone))) {
                        $('.tips').eq(3).addClass('errorTips').html('手机号码格式错误').css('color','red');
                        fPhone = false;
                        return false;
                    }

                    fPhone = true;
                    if (fPhone) {

                        all['admin_phone'] = $oPhone;

                        //查询邮箱是否唯一
                        $.post(oldSite + 'admin/user/phone',{phone:$oPhone},success,'json');
                    }
                }
            });


        /************    地址三级联动   **********************/
        //获取省级
        $('#sel1').change(function(){

            //关联
            //console.log(fPhone);
            if (!fPhone) {

                $('.tips').eq(4).addClass('errorTips').html('请先完成上一步操作').css('color','red');
                return false;
            } else {
                $('.tips').eq(4).html('');
            }

            //初始化,删除指定option
            $('.city').remove();
            $('.country').remove();

            //获取省级id
            $oFid = $('#sel1').val();
            $oFval = $('#sel1 > option:selected')[0].innerText;
            //console.log($oFval);
            //alert($oFid);

            //ajax
            if ($oFid) {

                //oldSel1 = $('#sel1').attr('dbPro');
                $.post(oldSite + 'admin/user/city',{fid:$oFid},success2,'json');
            }

        });

        //获取市级
        $('#sel2').change(function(){

            //初始化,删除指定option
            $('.country').remove();

            //获取市级id
            $oSid = $('#sel2').val();
            $oSval = $('#sel2 > option:selected')[0].innerText;
            console.log($oSval);
            //alert($oSid);

            //ajax
            if ($oFid) {
                //oldSel2 = $('#sel2').attr('dbCity');
                $.post(oldSite + 'admin/user/country',{sid:$oSid},success2,'json');
            }
        });

        //获取县区
        $('#sel3').change(function(){

            //获取县区id
            $oCid = $('#sel3').val();
            $oCval = $('#sel3 > option:selected')[0].innerText;
            //console.log($oCval);
            //alert($oCid);

            //比对三级地址
            if (oldSel1 == $oFid  && oldSel2 == $oSid  && oldSel3 == $oCid) {

                $('.tips').eq(4).addClass('errorTips').html('地址未修改').css('color','blue');
            } else {

                //是否合法
                if ($oFid && $oSid && $oCid) {

                    $('.tips').eq(4).addClass('errorTips').html('合法').css('color','green');
                }
            }

        });

        //创建option标签,并添加内容
        function success2(data)
        {
            console.log(data);
            switch (data.state) {

                //市级
                case 1:
                    //循环追加标签(整体)
                    for (var i in data.city) {

                        console.log('city:'+ data.city);
                        $('#sel2').append('<option class="city" value="'+ data.city[i]["area_id"] +'" dbCity="'+data.city[i]['area_id'] +'">'+ data.city[i]["area_name"] +'</option>');
                    }
                    break;

                //县区级
                case 2:

                    //循环追加标签(整体)
                    for (var j in data.country) {

                        $('#sel3').append("<option class='country'  value="+ data.country[j]["area_id"] +">"+ data.country[j]["area_name"] +"</option>");
                    }
                    break;
            }
        }

        /***************    地址三级联动    *******************/
        //地址,失去焦点
        $('[name=place]').blur(function () {

                //清空
                delete all['place'];

                //取值
                $oPlace = $('[name=place]').val().replace(/(^\s*)|(\s*$)/g, "");

                //比对详细地址
                if (oldPlace == $oPlace) {

                    $('.tips').eq(5).addClass('errorTips').html('详细地址未修改').css('color','blue');
                    fPlace = true;
                } else {

                    //判断是否为空
                    if ($oPlace.length ==0) {
                        $('.tips').eq(5).addClass('errorTips').html('详细地址不得为空').css('color','red');
                        fPlace = false;
                        return false;
                    }
                    fPlace = true;
                    all['detail_address'] = $oPlace;

                    $('.tips').eq(5).addClass('errorTips').html('详细地址').css('color','green');
                }

            });


        //点击按钮
        $("[name=btn]").click(function(){

            //关联
            if (!fPlace) {

                $('.tips').eq(5).addClass('errorTips').html('详细地址不得为空').css('color','red');
                return false;
            }

            //_省_市_县_
            var oldAddr = null ;
            if ($oFid > 0 && $oSid > 0 && $oCid > 0) {

                $addr = '_'+ $oFid +'_'+ $oSid +'_'+ $oCid +'_';
                oldAddr = '_'+ oldSel1 +'_'+ oldSel2 +'_'+ oldSel3 +'_';
                $allPlace = $oFval + $oSval + $oCval;
                //比对地址编号
                if (oldAddr != $addr) {

                    delete all['address'];
                    delete all['all_place'];
                    all['address'] = $addr;
                    all['all_place'] = $allPlace;
                }
            }

            //console.log($addr);
            //console.log(fName , fPwd, fEmail , fPhone, fPlace, fLev);
            //console.log(all);

            //总体提交
            if (fName && fPwd && fEmail && fPhone && fPlace && fLev) {

                  if (Object.keys(all).length > 0) {

                      //alert('了二楼了');
                      var $uid = $('[name=hide]').val();
                      var $arr = [];
                      //console.log(all);

                      //遍历,并转换成字符串
                      for (var key in all) {
                          var $k = key;
                          var $v = all[key];
                          if ($v != null) {
                              $arr.push($k + '===' + $v);
                          }
                      }
                      var $arrStr = $arr.join('++_++'); //字符串
                      console.log($arr);
                      console.log($arrStr);
                      console.log($uid);

                      $.post(oldSite + 'admin/admin/update',{uid:$uid,str:$arrStr},success,'json');
                  } else {
                      alert('您没有修改当前用户信息');
                  }
            }
        });



        //处理后台数据的回调函数
        function success(data) {

            console.log(data);

            switch (data.status) {
                //头像
                case 0 :
                    $oPic =  data.path;
                    console.log('$oPic');
                    break;
                //用户名
                case 1:
                    if (data.add) {
                        fPwd   = false;
                        fLev   = false;
                        fEmail = false;
                        fPhone = false;
                        fPlace = false;
                        $('.tips').addClass('errorTips').html('请先完成上一步操作').css('color','red');  //不合法
                        $('.tips2').addClass('errorTips').html('请先完成上一步操作').css('color','red');  //不合法
                    }
                    $('.tips').eq(0).addClass('errorTips').html(data.tip).css('color','red');  //不合法
                    fName = false;
                    break;
                case 2:
                    $('.tips').eq(0).addClass('errorTips').html(data.tip).css('color','green');  //合法
                    fName = true;
                    break;
                //邮箱
                case 3:
                    $('.tips').eq(2).addClass('errorTips').html(data.tip).css('color','red');  //已存在
                    fEmail = false;
                    break;
                case 4:
                    $('.tips').eq(2).addClass('errorTips').html(data.tip).css('color','green');  //合法
                    fEmail = true;
                    break;
                //号码
                case 5:
                    $('.tips').eq(3).addClass('errorTips').html(data.tip).css('color','red');  //存在
                    fPhone = false;
                    break;

                case 6:
                    $('.tips').eq(3).addClass('errorTips').html(data.tip).css('color','green');  //合法
                    fPhone = true;
                    break;

                //添加失败
                case 11:
                    alert(data.tip);
                    fName  = false;
                    fPwd   = false;
                    fLev   = false;
                    fEmail = false;
                    fPhone = false;
                    fPlace = false;
                    break;

                //修改成功
                case 13:
                    alert(data.tip);
                    //重载当前页面
                    window.location.reload();
                    break;
                //修改失败
                case 14:
                    alert(data.tip);
                    break;
            }

        }

    });

</script>
